import { Form, Input, Button } from '@/components/AntdMobile';
import { http } from '@/apis/http';
import { useNavigate } from 'react-router-dom';
interface LoginFormValues {
  username: string;
  password: string;
}

const Login = () => {
  const navigate = useNavigate();
  const onFinish = async (values: LoginFormValues) => {
    console.log('Success:', values);
    const res: any = await http.post('/login', values);
    console.log(res);
    if (res.code === 200) {
      localStorage.setItem('token', res.token);
      navigate('/home/1');
    }
  };
  const validatePassword = async (_: any, value: any) => {
    // const passwordReg = /^(?=.*[a-zA-Z])(?=.*\d).{8,}$/;
    if (!value) {
      return Promise.reject(new Error('密码不能为空'));
    }
    // if (!passwordReg.test(value)) {
    //   return Promise.reject(new Error('密码需至少8位，包含字母和数字'));
    // }
    return Promise.resolve();
  };

  return (
    <>
      <Form
        className="pt50"
        layout="horizontal"
        onFinish={onFinish}
        footer={
          <Button
            block
            type="submit"
            shape="rounded"
            color="primary"
            size="large"
          >
            提交
          </Button>
        }
      >
        <Form.Item
          name="username"
          label="用户名1"
          rules={[{ required: true, message: '姓名不能为空' }]}
        >
          <Input />
        </Form.Item>
        <Form.Item
          name="password"
          label="密码"
          rules={[{ validator: validatePassword }]}
        >
          <Input placeholder="请输入密码" clearable type={'password'} />
        </Form.Item>
      </Form>
    </>
  );
};
export default Login;
